
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <title>Title</title>
    <style>
        .item {
            margin-top: 10px;
            margin-right: 40px;
        }
    </style>
</head>
<body>
<div id="app">
    <el-badge :value="12" class="item">
        <el-button size="small">评论</el-button>
    </el-badge>
    <el-badge :value="3" class="item">
        <el-button size="small">回复</el-button>
    </el-badge>
    <el-badge :value="1" class="item" type="primary">
        <el-button size="small">评论</el-button>
    </el-badge>
    <el-badge :value="2" class="item" type="warning">
        <el-button size="small">回复</el-button>
    </el-badge>

    <el-dropdown trigger="click">
  <span class="el-dropdown-link">
    点我查看<i class="el-icon-caret-bottom el-icon--right"></i>
  </span>
        <el-dropdown-menu slot="dropdown">
            <el-dropdown-item class="clearfix">
                评论
                <el-badge class="mark" :value="12" />
            </el-dropdown-item>
            <el-dropdown-item class="clearfix">
                回复
                <el-badge class="mark" :value="3" />
            </el-dropdown-item>
        </el-dropdown-menu>
    </el-dropdown>
</div>
<script src="https://unpkg.com/vue@2/dist/vue.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script>
    let v = new vue({
        el:'#app',
        data: function (){
            return{

            }

        },
        methods:{

        }

    })
</script>
</body>
</html>